<template>
  <el-row class="table-with-pagination fill">
    <el-col :span="24" style="height: calc(100% - 32px);padding-bottom: 8px;">
      <t-table v-bind="$attrs" v-on="$listeners" :data="tableData">
        <slot></slot>
      </t-table>
    </el-col>
    <el-col :span="24" style="height: 32px;text-align: center">
      <t-pagination :queryParams="queryParams" :url="url" :data.sync="tableData" ref="pagination"/>
    </el-col>
  </el-row>
</template>

<script>
import table from './index.vue'

export default {
  name: "TTableWithPagination",
  components: {'t-table': table},
  props: {
    url: [String],
    queryParams: [Object]
  },
  data() {
    return {
      tableData: [],
    }
  },
  methods: {
    loadTableData() {
      this.$nextTick(() => {
        this.$refs['pagination'].loadTableData()
      })
    },
  }
}
</script>

<style lang="less" scoped>
</style>